<script setup lang="ts">
import AlertCircle from '@iconify-icons/tabler/alert-circle'
import type {QuestionTipPropsType} from './types'

withDefaults(defineProps<QuestionTipPropsType>(), {
  tip: ''
})
</script>

<template>
  <div class="x-question-tip">
    <n-tooltip>
      <template #trigger>
        <slot name="trigger">
          <s-icon
            v-bind="{
            iconProps: {
                icon: AlertCircle,
                width: 16,
                height: 16,
              }
            }"
          />
        </slot>
      </template>
      <template #default>
        <slot name="tip">{{ tip }}</slot>
      </template>
    </n-tooltip>
  </div>
</template>

<style lang="scss">
@use './style' as *;
</style>
